<template>
	<div class="custom-header">
		<div class="back" @click="back">
			<image src="/static/card/back.png" style="width: 20rpx;" mode="widthFix"></image>
		</div>
		<div class="title">
			{{$t(title)}}
		</div>
	</div>
</template>

<script>
	export default {
		props:['title'],
		methods: {
			back() {
				uni.navigateBack()
			}
		}
	}
</script>

<style lang="less">
	.custom-header {
		position: fixed;
		width: 100%;
		left: 0;
		top: 0;
		background: url("/static/card/header.png");
		background-size: 100% 100%;
		height: 90rpx;
		padding-top: var(--status-bar-height);
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 99;
		.back {
			position: absolute;
			left: 10rpx;
			bottom: 20rpx;
			width: 50rpx;
			height: 50rpx;
			display: flex;
			align-items: center;
			justify-content: center;
		}

		.title {
			color: #fff;
			font-size: 32rpx;
			font-weight: bold;
		}
	}
</style>